<!DOCTYPE HTML>
<html lang="zh" xmlns:th="http://www.thymeleaf.org"
	  xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<link th:href="@{/ajax/libs/jquery-layout/jquery.layout-latest.css}" rel="stylesheet"/>
<link th:href="@{/ajax/libs/jquery-ztree/3.5/css/metro/zTreeStyle.css}" rel="stylesheet"/>
<body>
<div class="ui-layout-west">
	<div class="main-content">
		<div class="box box-main" >
			<div class="box-header">
				<div class="box-title">
					<i class="fa icon-grid"></i> 终端列表
				</div>
				<div class="box-tools pull-right">
					<button type="button" class="btn btn-box-tool" id="btnExpand" title="展开" style="display:none;">
						<i class="fa fa-chevron-up"></i></button>
					<button type="button" class="btn btn-box-tool" id="btnCollapse" title="折叠">
						<i class="fa fa-chevron-down"></i></button>
					<button type="button" class="btn btn-box-tool" id="btnRefresh" title="刷新">
						<i class="fa fa-refresh"></i></button>
				</div>
			</div>
			<div class="ui-layout-content">
				<div id="tree" class="ztree" ></div>
			</div>
		</div>
	</div>
</div>

<div class=" ui-layout-center">
	<div class="row">
		<div class="wrapper wrapper-content animated fadeInRight ibox-content">
			<form  action="" method="post" name="Form" id="Form" class="form-horizontal m" enctype="multipart/form-data">
				<div class="form-group">
					<label class="col-sm-3 control-label">终端编号：</label>
					<div class="col-sm-8">
						<input id="tid" name="tid" class="form-control" type="text" placeholder="请输入终端编号">
					</div>
				</div>
				<div class="form-group">
					<label class="col-sm-3 control-label">故障原因：</label>
					<div class="col-sm-8">
						<input id="fault" list="datalistid" name="fault" class="form-control" type="text" placeholder="请输入终端编号">
						<datalist id="datalistid">
							<option>开关电源板烧坏</option>
							<option>4G板烧坏</option>
							<option>功放板烧坏</option>
							<option>TF卡故障</option>
							<option>雷击</option>
						</datalist>
					</div>
				</div>
<!--				<div class="form-group">-->
<!--					<label class="col-sm-3 control-label">备注：</label>-->
<!--					<div class="col-sm-8">-->
<!--						<input id="remark" name="remark" class="form-control" type="text" placeholder="请输入备注">-->
<!--					</div>-->
<!--				</div>-->
				<div class="form-group">
					<label class="col-sm-3 control-label">维修时间：</label>
					<div class="col-sm-8">
						<input id="createtime" name="createtime" class="form-control" type="text" placeholder="请输入维修时间">
					</div>
				</div>
				<div class="form-group">
					<label class="col-sm-3 control-label">维护人员：</label>
					<div class="col-sm-8">
						<input id="mstaff" name="mstaff" th:value="*{fname}" class="form-control" type="text" placeholder="请输入项目负责人">
					</div>
				</div>
			</form>
		</div>
	</div>
</div>

<div th:include="include::footer"></div>
<script type="text/javascript">
	var prefix = ctx + "broad/maintain"
	$("#form-maintain-add").validate({
		rules:{
			xxxx:{
				required:true,
			},
		}
	});
	$(function currentTime()
	{
		var now = new Date();

		var year = now.getFullYear();       //年
		var month = now.getMonth() + 1;     //月
		var day = now.getDate();            //日

		var hh = now.getHours();            //时
		var mm = now.getMinutes();          //分
		var ss = now.getSeconds();           //秒

		var clock = year + "-";

		if(month < 10)
			clock += "0";

		clock += month + "-";

		if(day < 10)
			clock += "0";

		clock += day + " ";

		if(hh < 10)
			clock += "0";

		clock += hh + ":";
		if (mm < 10) clock += '0';
		clock += mm + ":";

		if (ss < 10) clock += '0';
		clock += ss;

		$("#createtime").val(clock);
	})

	function submitHandler() {
		var a = $("#tid").val()

		if ($("#tid").val()=="" || $("#tid").val()==null) {
			alert('请选择终端');
			return false;
		}

		if ($.validate.form()) {
			$.operate.save(prefix + "/add", $("#Form").serialize(),function (data) {
				if(data.code==0){
					alert("操作成功")
				}
			});
		}
	}
</script>
<script th:src="@{/ajax/libs/jquery-layout/jquery.layout-latest.js}"></script>
<script th:src="@{/ajax/libs/jquery-ztree/3.5/js/jquery.ztree.all-3.5.js}"></script>
<script th:inline="javascript">
	$(function () {
		$('body').layout({west__size: 185});
		queryAreaTree();
	});

	function queryAreaTree() {
		var url = ctx + "broad/maintain/treeData";
		function zTreeOnCheck(event, treeId, treeNode) {
			var treeObj = $.fn.zTree.getZTreeObj("tree");
			var nodes = [];
			var tids = []
			nodes = treeObj.getCheckedNodes(true);
			if(nodes.length>0){
				nodes.forEach(function (item,index) {
					if(item.aid.length==15){
						tids.push(item.aid)
					}
				})
			}
			$("#tid").val(tids.toString())
		}
		var options = {
			url: url,
			onCheck: zTreeOnCheck,
			check: {
				enable: true,
				nocheckInherit: true,

				chkboxType: {
					"Y": "ps",
					"N": "ps"
				}
			},
			data: {
				simpleData: {
					enable: true
				}
			},
			expandLevel: 0,
		};
		$.tree.init(options);

	}

	$('#btnExpand').click(function () {
		$._tree.expandAll(true);
		$(this).hide();
		$('#btnCollapse').show();
	});

	$('#btnCollapse').click(function () {
		$._tree.expandAll(false);
		$(this).hide();
		$('#btnExpand').show();
	});

	$('#btnRefresh').click(function () {
		queryAreaTree();
	});
</script>

</body>
</html>
